<template>
  <div>
    <my-header></my-header>
    <!-- 头像 -->
    <div class="touxiang">
      <div class="img">
      <router-link to="/login"><img src="../assets/image/me/tou.png" alt=""></router-link> 
       <span>15535186299</span>
      </div>
    </div>
    <!-- 订单 -->
    <div class="linklist">
      <van-cell icon="shop-o" title="我的订单" is-link to="/" />
    </div>
    <!-- 分割线 -->
    <van-divider />
    <!--待付款  -->
    <div>
      <van-grid>
  <van-grid-item icon="shop-o" text="待付款" />
  <van-grid-item icon="shop-o" text="待收货" />
  <van-grid-item icon="shop-o" text="待安装" />
  <van-grid-item icon="shop-o" text="待评价" />
  <van-grid-item icon="shop-o" text="退货" />
</van-grid>
    </div>
    <!--  -->
     <!-- 分割线 -->
    <div class="fenge">

    </div>
    <!-- 购物车 -->
    <div class="shopcar">
      <van-cell icon="shop-o" title="购物车" is-link to="/" />
    </div>
    <!-- 优惠卷 -->
    <div class="shopcar">
      <van-cell icon="shop-o" title="优惠劵" is-link to="/" />
    </div>
    <!-- 客服帮助 -->
    <div class="shopcar">
      <van-cell icon="shop-o" title="客服帮助" is-link to="/" />
    </div>
    <!-- 关于途虎 -->
    <div class="shopcar">
      <van-cell icon="shop-o" title="关于途虎" is-link to="/" />
    </div>
    <myfooter></myfooter>
  </div>
</template>
<script>
import Myfooter from '../components/Myfooter.vue';
import MyHeader from '../components/MyHeader.vue';

export default {
  components: { MyHeader, Myfooter },
  data() {
    return {
       active: 0,
    };
  },
  methods: {
  },

}
</script>
<style scoped>


.touxiang{
  height: 100px;
  width: 100%;
  background-image: url('../assets/image/me/banner.png');
  position: relative;
}
.touxiang>.img{
  width: 3rem;
  height: 3rem;
 
      border-radius: 50%;
          margin-left: 1.75rem;
          position: absolute;
          top:20px;
          display: flex;
}
.touxiang>.img>a{
   width: 60px;
  height: 60px;
 
  padding: 0 11px;
}
.touxiang>.img>a>img{
  width: 60px;
  height: 60px;
}
.touxiang>.img>span{
  position: absolute;
  top:22px;
  left: 90px;
}
/* 订单 */
.linklist{
  width: 100%;
  height: 43px;
  background-color: blue;
}
.van-cell__title{
  position: relative;
}
.van-cell__title>span{
 
  position: absolute;
  left: 0;
}
.van-divider {
      border-color: #919397;
      margin: 1px 0;
}
.fenge{
  width: 100%;
  height: 15px;
  background-color: #d9d9d9;
}
/* 全部订单 */
.van-grid-item{
  flex-basis: 20% !important; 
}
/* 购物车 */
.shopcar{
  margin-top: 1%;
}
</style>